// pages/cart/index.js
import { showModal, showToast } from "../../utils/asyncWx.js";

Page({

  /**
   * 页面的初始数据
   */
  data: {
    addr: {},
    cart: [],
    allChecked: false,
    totalPrice: 0,
    totalNum: 0
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {

  },

  onShow () {
    const addr = wx.getStorageSync("addr");
    // 1. 获取缓存中的购物车数据
    const cart = wx.getStorageSync("cart") || [];
    // 2. 计算全选状态; every数组方法: 会遍历接受回调函数,当确保每一个回调函数都返回true时every方法的返回值为true; 注意空数组调用此方法, 返回值也是true; 由于后面也循环了数组, 优化掉此行代码
    // const allChecked = cart.length ? cart.every(v => v.checked) : false;
    // let allChecked = true;
    // 3. 计算总价和总数量
    // let totalPrice = 0;
    // let totalNum = 0;
    // cart.forEach(v => {
    //   if (v.checked) {
    //     totalPrice += v.num * v.goods_price;
    //     totalNum += v.num;
    //   } else {
    //     allChecked = false;
    //   }
    // });
    // 2.1 注意当cart为空数组时, 不会走forEach, 那么allChecked=true就存在问题
    // if (!cart.length) {
    //   allChecked = false;
    // }
    // this.setData({ addr, cart, allChecked, totalPrice, totalNum })
    this.setData({ addr });
    this.setCartState(cart);
  },

  // 获取收货地址
  handleAddAddr () {
    // 1. 调用小程序内置api, 获取用户收货地址
    wx.chooseAddress({
      success: (res) => {
        // 拼接详细地址, 并保存到微信内部存储中
        let addr = res;
        addr.all = addr.provinceName + addr.cityName + addr.countyName + addr.detailInfo;
        wx.setStorageSync("addr", addr);
      }
    });
  },

  // 处理商品选择
  handleItemChange (e) {
    // 1. 获取被修改的商品id
    const goods_id = e.currentTarget.dataset.id;
    // 2. 获取购物车数组
    let { cart } = this.data;
    // 3. 根据修改的商品id 找到目标商品
    let index = cart.findIndex(v => v.goods_id === goods_id);
    // console.log(index);
    // 4. 将选中状态取反
    cart[index].checked = !cart[index].checked;
    // 5. 更新数据和缓存
    this.setCartState(cart);
  },

  // 全选的反选事件
  handleItemAllChecked () {
    // 1. 获取数据
    let { cart, allChecked } = this.data;
    // 1.1 如果cart为[]空, 则提示,前往添加商品
    if (!cart.length) {
      wx.showToast({
        title: '您还没有添加商品!',
        icon: "none",
        duration: 1500,
        mask: true
      });
    }
    // 2. 修改cart数组中的选择状态
    cart.forEach(v => {
      v.checked = !allChecked;
    });
    // 3. 保存数据
    this.setCartState(cart);
  },

  // TODO 长按编辑数量功能

  // 编辑商品数量
  async handleItemNumEdit (e) {
    // 1. 获取传递参数
    const { id, operation } = e.currentTarget.dataset;
    // console.log(id);
    // console.log(operation);
    // 2. 获取购物车数组
    let { cart } = this.data;
    // 3. 找到需要修改的商品索引
    const index = cart.findIndex(v => v.goods_id === id);
    // 4. 修改数量

    if (cart[index].num === 1 && operation === -1) {
      // 4.1 当数量为1, 并且用户点击了减的操作时, 提示用户
      // wx.showModal({
      //   title: '提示',
      //   content: '您是否要删除该商品?',
      //   showCancel: true,
      //   cancelText: '取消',
      //   cancelColor: '#000000',
      //   confirmText: '确定',
      //   confirmColor: '#3CC51F',
      //   success: (res) => {
      //     if (res.confirm) {
      //       // 删除index位置起的1位元素
      //       cart.splice(index, 1)
      //       this.setCartState(cart);
      //     } else if (res.cancel) {
      //       console.log("用户取消操作");
      //     }
      //   }
      // });
      const res = await showModal({ content: "您是否要删除该商品?" });
      if (res.confirm) {
        cart.splice(index, 1)
        this.setCartState(cart);
      }
    } else {
      cart[index].num += operation;
      // 5. 保存数据
      this.setCartState(cart);
    }
  },

  // 结算事件
  async handleOrderPay () {
    const { cart, addr, totalNum } = this.data;
    // 1. 判断有无收货地址
    if (!addr.userName) {
      await showToast({ title: "您还没有添加收货地址!" });
      return;
    }
    // 2. 判断有无商品
    if (totalNum === 0) {
      if (cart.length === 0) {
        await showToast({ title: "您还没有添加商品!" });
        return;
      } else {
        await showToast({ title: "请选择需要购买的商品!" })
        return;
      }
    }
    // 3. 跳转到支付页面
    wx.navigateTo({
      url: '/pages/pay/index',
    });
  },

  // 清空购物车
  async handleCartClear () {
    let { cart } = this.data;
    if (cart.length === 0) {
      await showToast({ title: "购物车空空如也!" })
      return;
    } else {
      const res = await showModal({ content: "确定要清空购物车吗?" });
      if (res.confirm) {
        cart = [];
        this.setCartState(cart);
      }
    }
  },

  // 封装: 设置购物车状态并计算底部工具栏数据- 全选,总价,总数; 只需要修改好cart, 直接调用此方法即可完成后续计算
  setCartState (cart) {
    // 计算全选,总价格,总数量
    let allChecked = true;
    let totalPrice = 0;
    let totalNum = 0;
    cart.forEach(v => {
      if (v.checked) {
        totalPrice += v.num * v.goods_price;
        totalNum += v.num;
      } else {
        allChecked = false;
      }
    });
    if (!cart.length) {
      allChecked = false;
    };
    this.setData({ cart, allChecked, totalPrice, totalNum })
    wx.setStorageSync("cart", cart);
  }
})